<template>
    <div style="width: 100vw;height: auto;background: #fff;border-bottom: 4vw solid #f5f5f5">
     <div class="container">
       <header>
         <img src="../../assets/img/ic_team.png" alt="" style="width:6vw;height: 4.37vw;">这些小伙伴已经开团
         <span @click="checkMore">查看更多
         <img src="../../assets/img/rectang.png" alt=""></span>

       </header>
       <div class="group">
        <p class="open">由
          <span style="color: #ff9797;">慕**离</span>开团，还差 <span style="color: #ff4c50;">3</span>人成团</p>
         <footer>
           <div class="headIcoBox" align="center">
             <div></div>
             <div></div>
             <div></div>
             <div></div>
           </div>
           <button>立即参团</button>
         </footer>
       </div>

     </div>
    </div>
</template>

<script>
    export default {
        name: "openGroup",
      data(){
          return{
            show:false,
          }
      },
      methods:{
        checkMore(){
          this.show =!this.show;
        }
      }
    }
</script>

<style scoped lang="scss">
.container{
  width: 92vw;
  height: auto;
  margin: 0px auto;
  padding-top: 4.3vw;
  margin-bottom: 5vw;
  footer{
    width: 92%;
    height: 16.34vw;
    margin:0px auto;
      button{
        width: 21vw;
        height: 8.3vw;
        background:linear-gradient(-90deg,rgba(255,53,53,1) 0%,rgba(255,66,122,1) 100%);
        float: right;
        margin-top: 4vw;
        font-size: 15px;
        color:#fff;
        border-radius: 1vw;
      }
      .headIcoBox{
        width: 56.67vw;
        height: 10.67vw;
        display: inline-block;
        margin-top: 3vw;
        div{
          width: 10.67vw;
          height: 10.67vw;
          border: 1px dashed red;
          display: inline-block;
          margin: 0 1.1vw 0 1.1vw;
          border-radius: 6vw;
        }
      }
  }
  .group{
    width:100%;
    height:26.67vw;
    background:rgba(255,255,255,1);
    border:2px solid rgba(255,214,214,1);
    box-shadow:0px 6px 26px 0px rgba(255,153,173,0.2);
    border-radius:4vw;
    margin-top: 4vw;
      .open{
        font-size: 14px;
        color: #666;
        height: 9.34vw;
        line-height: 9.34vw;
        text-indent: 4vw;
        border-bottom: 1px solid #FFE6E6;
      }
     }
    header{
      text-indent: 1vw;
      font-size: 15px;
      color: #333;
      span{
        float: right;
        font-size: 13px;
        color: #666;
      }
      img{
        width: 3vw;
        height: 3.2vw;
      }
    }
}
</style>
